<template>
  <!-- 新增或修改单位 -->
  <el-dialog :visible.sync="visible"
             :close-on-click-modal="false"
             @close="dialogClose"
             :title="dialogStatus==='create'?'新增单位名称':'修改单位名称'"
             width="30%">
    <el-form :model="editOrgForm"
             :rules="formRules"
             ref="editOrgForm"
             label-width="80px">
      <el-form-item label="单位名称"
                    prop="name">
        <el-input v-model="editOrgForm.name"
                  autocomplete="off"
                  style="width:100%!important"
                  placeholder="请输入单位名称"></el-input>
      </el-form-item>
      <el-form-item label="备注"
                    prop="remark"
                    class="add_tips">
        <el-input v-model="editOrgForm.remark"
                  autocomplete="off"
                  style="width:100%!important"></el-input>
      </el-form-item>
    </el-form>
    <div style="text-align:center;">
      <el-button @click="dialogClose"
                 id="back-style">返 回</el-button>
      <el-button @click="editOrg"
                 type="primary"
                 id="save-style">保 存</el-button>
    </div>
  </el-dialog>
</template>
<script>
import { backEvaluateApi } from '@/services/ProjectCenter'
import { organizationApi } from '@/services/CompanySetting'
export default {
  data () {
    return {
      visible: false,
      editOrgForm: {
        name: '',
        org_type: '',
        remark: '',
        name: '',
        remark: '',
      },
      formRules: {
        name: [
          { required: true, message: '请输入单位名称', trigger: 'change' }
        ],
      }
    }
  },
  props: {
    dialogVisible: Boolean,
    dialogForm: Object,
    dialogStatus: String,
    callback: Function
  },
  watch: {
    dialogVisible (newval, oldval) {
      this.visible = newval
    },
    dialogForm: {
      handler (newval, oldval) {
        this.editOrgForm = Object.assign(this.editOrgForm, JSON.parse(JSON.stringify(newval)))
        if (this.dialogStatus === 'update') {
          this.editOrgForm.name = this.editOrgForm.node_name
          this.editOrgForm.remark = this.editOrgForm.remark
        } else if (this.dialogStatus === 'create') {
          this.editOrgForm.name = ''
          this.editOrgForm.remark = ''
        }
        delete this.editOrgForm.children
        delete this.editOrgForm.children_list
        console.log(this.editOrgForm)
      },
      deep: true
    },
    dialogStatus (newval, oldval) {
      // if (newval === 'update') {
      //   this.editOrgForm.name = this.editOrgForm.name
      //   this.editOrgForm.remark = this.editOrgForm.remark
      // } else if (newval === 'create') {
      //   this.editOrgForm.name = ''
      //   this.editOrgForm.remark = ''
      // }
    }
  },
  methods: {
    editOrg () {
      this.$refs.editOrgForm.validate((valid) => {
        if (valid) {
          if (this.dialogStatus === 'create') {
            this.createOrg()
          } else if (this.dialogStatus === 'update') {
            this.updateOrg()
          }
        }
      })
    },
    // 新增单位
    createOrg () {
      // this.editOrgForm.p_id = this.editOrgForm.node_id;
      // organizationApi.createOrg({
      backEvaluateApi.saveObs({
        data: this.editOrgForm
      }).then(res => {
        console.log(res, 'create org')
        if (res.code === 0) {
          this.$message.success('新增单位成功')
          this.dialogClose()
          this.$emit('callback', 'success')
        }
      })
    },
    // 修改单位
    updateOrg () {
      // organizationApi.updateOrg({        
      backEvaluateApi.editObs({//修改
        data: this.editOrgForm
      }).then(res => {
        console.log(res, 'update org')
        if (res.code === 0) {
          this.$message.success('修改单位成功')
          this.dialogClose()
          this.$emit('callback', 'success')
        }
      })
    },
    dialogClose () {
      this.$refs.editOrgForm.resetFields()
      this.$emit('update:dialogVisible', false)
      this.$emit('update:dialogStatus', '')
    }
  },

  created () {
  },
  mounted () {
  }
}
</script>
<style scoped lang='scss'>
</style>
